<style type="text/css">

</style>
<div id="layui-container" class="layui-anim layui-anim-downbit">
    <div class="layui-btn-container">
        <button class="layui-btn" type="button" lay-active="loadQrcodeImg">获取二维码</button>
        <button class="layui-btn" type="button" lay-active="qrScanStatus">二维码扫码状态</button>
        <button class="layui-btn" type="button" lay-active="getUserInfo">获取用户信息</button>
        <button class="layui-btn" type="button" lay-active="doCheck">验证扫码返回的参数</button>
    </div>
    <div class="layui-row">
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">用户信息</label>
            <div class="layui-input-block">
                <textarea id="userInfo" name="userInfo" placeholder="用户信息显示在这" rows="20"
                          class="layui-textarea" readonly="readonly"></textarea>
            </div>
        </div>
    </div>
    <div class="layui-row">
        <img id="qrImg" src="" alt=""/>
    </div>
</div>
<script type="text/javascript">
    layui.use(['util'], function () {
        let util = layui.util;

        let actionId;
        let userInfo;

        let active = {
            loadQrcodeImg: function () {
                $('#userInfo').val('');
                userInfo = null;
                request.bodyAjax(api.qrCodeImg, {
                    qrcodeType: 'LOGIN',
                    // 携带的额外参数
                    extAttrs: {
                        test: 123
                    }
                }, function (res) {
                    if (res.success && res.status === 200) {
                        let $qrImg = $('#qrImg');
                        $qrImg.attr('src', api.viewCodeImg + res.data + "?n=" + new Date().getTime());
                        actionId = res.data;
                    }
                });
            },
            qrScanStatus: function (noToast, func) {
                request.bodyAjax(api.scanResult, {
                    actionId: actionId
                }, function (res) {
                    if (res.success && res.status === 200 && res.data !== false) {
                        if (noToast !== 1) {
                            layer.alert("二维码已被扫描");
                        }
                        userInfo = res.data;
                    } else {
                        if (noToast !== 1) {
                            layer.msg("没有查询到已扫描状态");
                        }
                    }
                    if (func) {
                        func();
                    }
                });
            },
            getUserInfo: function () {
                active.qrScanStatus(1, function () {
                    if (userInfo) {
                        $('#userInfo').val(JSON.stringify(userInfo));
                        localStorage.setItem("accessToken", userInfo.accessToken);
                    }
                });
            },
            doCheck: function (data) {
                data = userInfo || {};
                data.logicParam = {};
                request.bodyAjax(api.doCheck, data, function (res) {
                    layer.alert(JSON.stringify(res));
                });
            }
        };

        // layui的btn单独添加点击事件
        util.event('lay-active', active);

    });
</script>
